<html>
    <head>
        <title>Prop的大小写</title>
    </head>
    <body>
        <script>
             // Prop的大小写（ camelCase vs kebab-case）
                                    /*
                                        html中的 attribute 是大小写敏感的，所以，浏览器会把"所有大写字符转化成小写"。
                                        这意味着，当你使用DOM中的模板时，  camelCase(驼峰命名法)的 prop 名需要使用其等价的 kebab-case(短横线分割命名)
                                    */
                                    Vue.component('blog-post',{
                                            // 在 JavaScript中 是 camelCase的
                                            props:['postTitle'],
                                            template:'<h3>{{postTitle}}</h3>'
                                    })

                                  /*
                                      在Html中，属性要写成 kebab-case

                                      <blog-post post-title="hello!"></blog-post>
                                  */

                                  // 重审一次，如果你使用字符串模板，那么这个限制就不存在了。
        </script>
    </body>
</html>